<div class="dateContent">
	<br>
	<div class="dateBox" style="height:26px">
		
		<?=$form->create('User', array('action' =>'demographics', 'type' =>'get' ));?>

		<div class="dateButton" style="float:right;padding-right: 11px;">
			<?=$this->Form->button('Filter', array('class' => '', 'type' => 'submit', 'name'=>'userDisplay')); ?>		
		</div>
		
		<div class="date" style="float:right;padding-right: 10px;">
			<?=$form->input('to',array('id'=>'to', 'class' => 'inputBox', 'label'=>""));?>
		</div>
		<div class="date" style="float:right;padding-right: 10px;padding-top: 2px;font-size: 14px;">
			<label for="to">To: </label>
		</div>
		
		<div class="date" style="float:right;padding-right: 10px;">
			<?=$form->input('from',array('id'=>'from', 'class' => 'inputBox', 'label'=>""));?>
		</div>
		<div class="date"style="float:right;padding-right: 10px;padding-top: 2px;font-size: 14px;" >
			<label for="from">From: </label>
		</div>
	
		<?=$this->Form->end();?>
	</div>	
</div>
<?
// debug($age);
// debug($age_tops);
$colorSet=array('ABDD79', '92C1D6', 'FCE66C', 'E74862', 'FEC514', 'F5C5b4');
//--------------member data---------------
		
	$member='<chart><series>';
	$i=0;
	foreach($users as $date=>$user){
		$member .= '<value xid=\"'.$i.'\">'.$date.'</value>';
		$i++;
	}	
	$member .= '</series><graphs><graph gid=\"1\">';
	$i=0;
	foreach($users as $date=>$user){
		$member.= <<<EOT
<value xid=\"{$i}\">{$user}</value>			
EOT;
	$i++;
	}
	$member .='</graph></graphs></chart>';
//--------------deal data--------------
	$deal_data = '';
    for($i=0; $i<count($deals);$i++){
		$temp = 'deal_'.$deals[$i]['Category']['id'];
		$deal_data .= $deals[$i]['Category']['name'].";".
		$deals[$i%sizeof($colorSet)]['percentage'].
		";false;".$colorSet[$i%6].
		";javascript:detail_demographic('".$temp."');\\n";
	}
	
	//--------------sale data--------------
	$sale_data = '';

	for($i=0; $i<count($sales);$i++){
		$temp = 'sale_'.$sales[$i]['Category']['id'];
		$sale_data .= $sales[$i]['Category']['name'].";".
		$sales[$i%sizeof($colorSet)]['percentage'].
		";false;".$colorSet[$i%6].
		";javascript:detail_demographic('".$temp."');\\n";
	}
?>

	
	<?
	// sale demographics
	foreach($sale_tops as $key=>$top):
		// $div_name='gender_'.$category;
		$div_name='sale_'.$key;
	?>
	
	<div id="<?=$div_name?>" style='margin:auto; text-align:center; width:800px; display:none'>
		<table cellspacing='0' cellpadding='5' style="border:1px solid #70c6d0;width:100%;">
			<tr class="tableHeader thTableEvenRow">
				<td style="width:10%">Rank</td>
				<td style="width:11%">Sale Id</td>
				<td style="width:30%">Seller</td>
				<td>Buyer</td>
			</tr>
			<?
			
			$contents='';
			$odd=true;$counter=0;
			foreach ($top as $value)
			{
				$counter++;
				if ($odd) $class='thTableOddRow'; else $class='thTableEvenRow';
					$contents.="<tr class='".$class."'>
									<td>". $counter ."</td>
									<td>".$value['Detail']['id']."</td>
									<td>".$all_user[$value['deals']['user_id']]."</td>
									<td>".$all_user[$value['Detail']['user_id']]."</td>
									</tr>";
						$odd=!$odd;
			}//end of foreach
			echo $contents;	
			?>
		</table>
	</div>
	<?endforeach;?>
	
	<?
	// Deal demographics
	foreach($deal_tops as $key=>$top):
		$div_name='deal_'.$key;
	?>
	
	<div id="<?=$div_name?>" style='margin:auto; text-align:center; width:800px; display:none'>
		<table cellspacing='0' cellpadding='5' style="border:1px solid #70c6d0;width:100%;">
			<tr class="tableHeader thTableEvenRow">
				<td style="width:10%">Rank</td>
				<td style="width:11%">Deal Id</td>
				<td style="width:40%">Name</td>
				<td>Description</td>
			</tr>
			<?
			
			$contents='';
			$odd=true;$counter=0;
			foreach ($top as $value)
			{
				$counter++;
				if ($odd) $class='thTableOddRow'; else $class='thTableEvenRow';
					$contents.="<tr class='".$class."'>
									<td>". $counter ."</td>
									<td>".$value['Detail']['id']."</td>
									<td>".$value['Detail']['name']."</td>
									<td>".$value['Detail']['description']."</td>
									</tr>";
						$odd=!$odd;
			}//end of foreach
			echo $contents;	
			?>
		</table>
	</div>
	<? endforeach;?>

      <div id="centerColumn" class="CenterCol x-wide cfix">

            <!--main-->

            <div class="Superadmin">

                <div class="" style="width: 100%;">
                    <div id="graph" style="display: none;">
                        Loading graph...
					</div>
                </div>
				<div id="flashcontent" >

                    <strong>You need to upgrade your Flash Player</strong>

                </div>
		
				<div id="flashcontent2" style="position:relative; margin-top:50px; width:450px;" >

                    <strong>You need to upgrade your Flash Player</strong>

                </div>
				<div id="flashcontent1" style="position:relative; width:450px; margin-top:-300px; margin-left: 500px">

                    <strong>You need to upgrade your Flash Player</strong>

                </div>
            <!--end:main-->

        </div>

	<script type="text/javascript">
		// <![CDATA[
                    var so4 = new SWFObject("<? echo $this->webroot;?>js/amcharts/amcolumn/amcolumn.swf?cache=0", "amcolumn", "100%", "300", "8", "#ffffff");
                    so4.addVariable("path", "<? echo $this->webroot;?>js/amcharts/amcolumn/");
                    so4.addVariable("settings_file", encodeURIComponent("<? echo $this->webroot;?>js/amcharts/amcolumn/TotalMembers.xml"));
                    so4.addVariable("chart_data", encodeURIComponent("<? echo $member;?>"));
                    //so4.addVariable('data_file', escape('/admin/analytics/Demographics.aspx?ajax=1&type=9&begindate=' + $('#tbBeginTime').val() + '&enddate=' + $('#tbEndTime').val()));
                    so4.addVariable("preloader_color", "#000000");
                    so4.addParam("wmode", "transparent");
                    so4.write("flashcontent");
                    // ]]>
	  // <![CDATA[		
      
                    var so = new SWFObject("<? echo $this->webroot;?>js/amcharts/ampie/ampie.swf?cache=0", "ampie", "100%", "300", "8", "#ffffff");
                    so.addVariable("path", "<? echo $this->webroot;?>js/amcharts/ampie/");
                    so.addVariable("settings_file", encodeURIComponent("<? echo $this->webroot;?>js/amcharts/ampie/ampie_settings_sale.xml"));
                    so.addVariable("chart_data", encodeURIComponent("<? echo $sale_data;?>"));
                    so.addVariable("preloader_color", "#000000");
                    so.addParam("wmode", "transparent");
                    so.write("flashcontent1");
                    // ]]>
				// <![CDATA[		
                    var so2 = new SWFObject("<? echo $this->webroot;?>js/amcharts/ampie/ampie.swf?cache=0", "ampie", "100%", "300", "8", "#ffffff");
                    so2.addVariable("path", "<? echo $this->webroot;?>js/amcharts/ampie/");
                    so2.addVariable("settings_file", encodeURIComponent("<? echo $this->webroot;?>js/amcharts/ampie/ampie_settings_deal.xml"));
                    so2.addVariable("chart_data", encodeURIComponent("<? echo $deal_data;?>"));
                    so2.addVariable("preloader_color", "#000000");
                    so2.addParam("wmode", "transparent");
                    so2.write("flashcontent2");
                    // ]]>
                    
	 </script>
	 
	 <script language="javascript" type="text/javascript">

	function detail_demographic(id){
		jQuery.facebox({ div: '#'+id });
	}

</script>
